<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>12 模板</title>
    <script src="../js/vue.min.js"></script>
    /* 必须配置css样式，否则不生效 */
    [v-cloak]{
    display:none;
    }
</head>
<body>
<div id="app">
    <hr>
    <input type="text" v-model="msg">

    <h3>aaa<span v-cloak>{{msg}}</span></h3>
    <hr>
    <h3 v-text="msg"></h3> v-text 不会解析html标签原样输出
    <hr>
    <h3 v-html="msg"></h3> v-html解析时会把html标准标签去掉
    <hr>
    <h3 v-once>{{msg}}</h3> v-once只渲染一次
    <hr>
    <h3 v-pre>{{msg}}</h3> v-pre 原样输出
</div>
<script>
    let vm = new Vue({
        el: "#app",
        data() {
            return {
                msg: 'hello world'
            }
        }
    })
</script>
</body>
</html>